<template>
  <jl-base>
    <div class="w12">
      <jl-header>
        <mt-header title="新增合同" :fixed="true">
          <i slot="left">
            <mt-button icon="back" @click="back"></mt-button>
          </i>
        </mt-header>
      </jl-header>

      <jl-content style="background-color: #f1f1f1;">
        <div class="dld_title">
          <span class="fl"><i class="fa fa-user mr5"></i>{{goods.LXR}}</span>
          <span class="fl ml20"><i class="fa fa-phone-square mr5"></i>{{goods.LXDH}}</span>
          <span class="w12 font_size_standard mt10"><i class="fa fa-map-marker mr5"></i>{{goods.AZDZ}}</span>
        </div>

        <div class="dld_body">
          <jl-from-input label="工程商品编码" type="number" v-model="goods.GCSPBM"/>

          <div class="jl_list">
            <div class="jl_list_item bor_bottom">
              <span class="w12">{{goods.GCSPMC}}</span>
            </div>
          </div>

          <jl-from-input label="合同数量" required placeholder="请输入合同数量" v-model="goods.PFSL"/>
          <jl-from-input label="合同单价" required v-model="goods.SQDJ"/>

          <jl-from-input disabled label="合同金额" :value="goods.SQJE|money"></jl-from-input>

          <jl-from-query label="安装地址"
                         type="interface"
                         sqlid="scm.gcgl.gcdl.GCDLDAZDZ"
                         :params="{GCDLD01:orderInfo.GCDLD01,GSXX01:orderInfo.GSXX01}"
                         @ok="chooseAddress" required>
            <div class='jl_form'>
              <div class='jl_form_item bor_bottom'>
                <span class='w12'>
                  {AZDZ}
                </span>
                <span class='w04'>
                  {LXR}
                </span>
                <span class='w08'>
                  {LXDH}
                </span>
                <i class='fa fa-angle-right'></i>
              </div>
            </div>
          </jl-from-query>
          <jl-from-input label="联系人" v-model="goods.LXR"/>
          <jl-from-input label="联系电话" v-model="goods.LXDH"/>

          <jl-from-textarea required placeholder="请输入商品备注信息" v-model="goods.BZ"/>
        </div>
      </jl-content>
    </div>
  </jl-base>
</template>

<script>
  export default {
    name: 'goods-edit',
    props: {
      goods: {
        type: Object, default() {
          return {}
        }
      },
      edit_show: {
        type: Boolean,
        default: false
      },
      orderInfo: {
        type: Object, default() {
          return {}
        }
      }
    },
    methods: {
      back() {
        this.$set(this.goods, 'edit_show', false)
        this.$emit('back', false)
      },
      calc() {
        this.goods.SQJE = this.goods.PFSL * this.goods.SQDJ
        this.$set(this.goods, 'SQJE', this.goods.SQJE)
      },
      chooseAddress(item) {
        this.$set(this.goods, 'AZDZ', item.AZDZ)
        this.$set(this.goods, 'LXR', item.LXR)
        this.$set(this.goods, 'LXDH', item.LXDH)
      }
    },
    watch: {
      goods(n, o) {
      },
      'goods.SQSL': function (n) {
        this.goods.PFSL = n
        this.calc()
      },
      'goods.PFSL': function () {
        this.calc()
      },
      'goods.SQDJ': function (n) {
        this.goods.PFDJ = n
        this.calc()
      },
    },
    created() {
      this.$set(this.goods, 'PFSL', this.goods.SQSL)
      this.$set(this.goods, 'SQDJ', this.goods.PFDJ)
      this.$set(this.goods, 'SQJE', this.goods.PFJE)
    }
  }
</script>

<style scoped>

</style>
